<!-- Filter -->
<div class="modal fade" id="logstreamFilterModal" tabindex="-1" aria-labelledby="logstreamFilterModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog modal-dialog-centered modal-sl">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="logstreamFilterModalLabel">Filter</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text" id="logstreamFilterModalInputIcon"><i class="fas fa-filter"></i></span>
                    </div>
                    <input id="logstreamFilterModalInput" type="text" class="form-control" placeholder="Filter log" aria-label="Filter" aria-describedby="logstreamFilterModalInputIcon">
                    <div class="input-group-append">
                        <button id="logstreamFilterModalInputButton" type="button" class="btn btn-success">Apply</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Levels -->
<div class="modal fade" id="logstreamLogLevelsModal" tabindex="-1" aria-labelledby="logstreamLogLevelsModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable modal-xl">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="logstreamLogLevelsModalLabel">Log Levels</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <table class="table table-hover table-sm">
                    <tbody id="logstreamLogLevelsModalTableBody">
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<!-- Columns -->
<div class="modal fade" id="logstreamColumnsModal" tabindex="-1" aria-labelledby="logstreamColumnsModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-sm">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="logstreamColumnsModalLabel">Columns</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="custom-control custom-switch">
                    <input checked type="checkbox" class="custom-control-input" id="logstreamColumnsModalLevelIconSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalLevelIconSwitch">Log Level Icon</label>
                </div>

                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalSequenceNumberSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalSequenceNumberSwitch">Sequence Number</label>
                </div>

                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalHostNameSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalHostNameSwitch">Host Name</label>
                </div>
                
                <div class="custom-control custom-switch">
                    <input checked type="checkbox" class="custom-control-input" id="logstreamColumnsModalDateSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalDateSwitch">Date</label>
                </div>

                <div class="custom-control custom-switch">
                    <input checked type="checkbox" class="custom-control-input" id="logstreamColumnsModalTimeSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalTimeSwitch">Time</label>
                </div>

                <div class="custom-control custom-switch">
                    <input checked type="checkbox" class="custom-control-input" id="logstreamColumnsModalLevelSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalLevelSwitch">Log Level</label>
                </div>

                <div class="custom-control custom-switch">
                    <input checked type="checkbox" class="custom-control-input" id="logstreamColumnsModalLoggerNameAbbreviatedSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalLoggerNameAbbreviatedSwitch">Logger Name (Abbreviated)</label>
                </div>
                
                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalLoggerNameSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalLoggerNameSwitch">Logger Name</label>
                </div>
                
                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalLoggerClassNameSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalLoggerClassNameSwitch">Logger Class Name</label>
                </div>
                
                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalSourceClassFullAbbreviatedSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalSourceClassFullAbbreviatedSwitch">Full Class Name (Abbreviated)</label>
                </div>

                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalSourceClassFullSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalSourceClassFullSwitch">Full Class Name</label>
                </div>

                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalSourceClassSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalSourceClassSwitch">Class Name</label>
                </div>

                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalSourceMethodNameSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalSourceMethodNameSwitch">Method Name</label>
                </div>

                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalSourceFileNameSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalSourceFileNameSwitch">File Name</label>
                </div>
                
                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalSourceLineNumberSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalSourceLineNumberSwitch">Line Number</label>
                </div>
                
                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalProcessIdSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalProcessIdSwitch">Process Id</label>
                </div>

                <div class="custom-control custom-switch">
                    <input checked type="checkbox" class="custom-control-input" id="logstreamColumnsModalProcessNameSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalProcessNameSwitch">Process Name</label>
                </div>
                
                <div class="custom-control custom-switch">
                    <input type="checkbox" class="custom-control-input" id="logstreamColumnsModalThreadIdSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalThreadIdSwitch">Thread Id</label>
                </div>

                <div class="custom-control custom-switch">
                    <input checked type="checkbox" class="custom-control-input" id="logstreamColumnsModalThreadNameSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalThreadNameSwitch">Thread Name</label>
                </div>

                <div class="custom-control custom-switch">
                    <input checked type="checkbox" class="custom-control-input" id="logstreamColumnsModalMessageSwitch">
                    <label class="custom-control-label" for="logstreamColumnsModalMessageSwitch">Log message</label>
                </div>

            </div>
        </div>
    </div>
</div>
